<template>
  <!-- 文件预览弹框 -->
  <div class="app-container" v-loading="pageLoading">
    <z-table :list="replaceList" :tableProps="serviceTableProps" :columns="columns">
    </z-table>
    <z-pagination :pagination="pagination" :total="total" :page.sync="query.page" :limit.sync="query.size"
      @change="GetTpmEquipmentPartLogList"></z-pagination>
  </div>
</template>

<script>
import commonMixin from '@/views/_common/mixin'
export default {
  name: 'detailTab5',
  mixins: [commonMixin],
  components: {},
  props: {
    deviceId: {
      type: String,
      default: '',
    },
  },
  data() {
    return {
      baseUrl: this.$api.baseUrl,
      query: {
        page: 1,
        size: 10,
      },
      serviceTableProps: {
        border: true,
        fixed: false,
        hideOperations: true,
      },

      columns: [
        { title: '备件料号', key: 'item_no' },
        { title: '备件编号', key: 'serial_number' },
        { title: '更换数量', key: 'qty' },
        { title: '备注', key: 'remarks' },
        { title: '更换时间', key: 'date' },
        { title: '更换人', key: 'executor' },
      ],

      name: '备件履历',
      replaceList: [],
    }
  },
  computed: {},
  watch: {
    deviceId: {
      immediate: true,
      handler(val, old) {
        if (val != '' && val != old) {
          this.GetTpmEquipmentPartLogList()
        }
      },
    },
  },
  created() {},
  mounted() {},
  methods: {
    GetTpmEquipmentPartLogList() {
      let Data = {
        machine_id: this.deviceId,
        page: this.query.page,
        size: this.query.size,
      }
      this.$request(this.baseUrl + 'Tpm/TpmEquipmentPart/GetTpmEquipmentPartLogList', Data, 'post').then((r) => {
        const { list, total } = r
        this.replaceList = list
        this.total = total
      })
    },
  },
}
</script>

<style lang="scss" scoped>
.icon-class {
  font-size: 18px;
  cursor: pointer;
}
</style>